<template>
  <form>
    <legend>添加英雄</legend>
    <div class="form-group">
      <label>英雄名称</label>
      <input type="text" class="form-control" v-model="heroName" />
    </div>
    <div class="form-group">
      <label>英雄性别</label>
      <div>
        <input type="radio" value="男" v-model="gender" /> 男
        <input type="radio" value="女" v-model="gender" /> 女
      </div>
    </div>
    <button class="btn btn-primary" @click.prevent="hAdd">提交</button>
  </form>
</template>
<script>
export default {
  data() {
    return {
      heroName: "",
      gender: "男",
    };
  },
  methods: {
    hAdd() {
      const { heroName, gender } = this;
      if (heroName === "") return;
      this.$http("heroes", "post", { heroName, gender, cTime: Date.now() }).then((res) => {
        this.$router.push("/");
      });
    },
  },
};
</script>